<template>
	<view class="container">
		<view class="row desk-header" v-if="deskInfo.name">{{deskInfo.name}}</view>
		<!-- <view class="row desk-header">请选择到店自取时间</view> -->
		<view class="col goods-list">
			<view class="row title">确认订单商品</view>
			<view class="row goods-item" v-for="(item,index) in confirmOrderData.cart_list" v-bind:key="index">
				<image class="cover-image" :src="item.goods_info.image" mode="aspectFill"></image>
				<view class="col goods-content-main">
					<view class="goods-name">{{item.goods_info.name}}</view>
					<view class="subtitle text-ellipsis" v-if="item.goods_info.goods_naming.name">{{item.goods_info.goods_naming.name}}</view>
					<view class="row">
						<view class="price">¥{{item.goods_info.goods_price}}</view>
						<view class="row operate auto-left">x{{item.goods_num}}</view>
					</view>
				</view>
			</view>
		</view>
		<view class="col total-view">
			<view class="row item">
				<view class="label">优惠券</view>
				<view class="auto-left orange" v-if="chooseCouponInfo.id" @click="chooseCoupon">
					-￥{{chooseCouponInfo.money}}>
				</view>
				<view v-else @click="chooseCoupon" class="auto-left " :class="confirmOrderData.coupon_list.length>0?'orange':''">{{confirmOrderData.coupon_list.length}}张可用{{confirmOrderData.coupon_list.length>0?'>':''}}</view>
			</view>
			<view class="row item">
				<view class="label">现金红包</view>
				<view class="auto-left orange" v-if="chooseRedPacketInfo.id" @click="chooseCoupon">
					-￥{{chooseRedPacketInfo.money}}>
				</view>
				<view v-else @click="chooseRedPacket" class="auto-left" :class="confirmOrderData.store_red_list.length>0?'orange':''">{{confirmOrderData.store_red_list.length}}个可用{{confirmOrderData.store_red_list.length>0?'>':''}}</view>
			</view>
			<view class="row item">
				<view class="label">实付款</view>
				<view class="auto-left price">¥{{total_price}}</view>
			</view>
		</view>
		<view style="height: 98rpx;background:#fff"></view>
		<view class="row bottom">
			<view class="row cart-view">
				<text class="count">合计：</text>
				<text class="price">¥{{total_price}}</text>
			</view>
			<view class="row confirm auto-left" @click.stop="buy">立即支付</view>
		</view>
		<!-- 弹出阴影 -->
		<view @click.stop="changeMask" @touchmove.stop="catchtouchmove" class="mask" v-if="showMask"></view>
		<!-- 弹出商品信息 -->
		<view class="col pay-mask" v-if="showMask">
			<view class="mask-main">
				<view class="row pay-type">
					<view class="pay-type-title">选择支付方式</view>
					<image class="auto-left" :src="url+'/static/imgs/payment/close.png'" @click.stop="changeMask"></image>
				</view>
			</view>
			<view class="col pay-type-group">
				<view class="row pay-type-item" @click="changePaymentMethod" data-type="wx_pay" :data-enable="true">
					<image class="pay-icon-wx" :src="url+'/static/imgs/payment/wx-pay.png'"></image>
					<text>微信支付 </text>
					<image class="auto-left checkbox" :src="url+'/static/imgs/payment/checked.png'" v-if="payment_method=='wx_pay'"></image>
					<image class="auto-left checkbox" :src="url+'/static/imgs/payment/check.png'" v-else></image>
				</view>
				<view class="row pay-type-item" @click="changePaymentMethod" data-type="balance" :data-enable="balance_pay_state">
					<image class="pay-icon-balance" :src="url+'/static/imgs/payment/balance.png'"></image>
					<text>余额支付</text>
					<text class="balance">（￥{{memberStoreInfo.usableBalance}}）</text>
					<image class="auto-left checkbox" :src="url+'/static/imgs/payment/checked.png'" v-if="payment_method=='balance'"></image>
					<image class="auto-left checkbox" :src="url+'/static/imgs/payment/check.png'" v-else></image>
				</view>
			</view>
		</view>
	</view>
</template>
<style>
	@import url("../../../../common/css/order-goods.css");

	.balance {
		color: #999 !important;
	}
</style>
<script>
	var app = getApp();
	import http from "../../../../common/js/request.js";
	export default {
		data() {
			return {
				store_id: app.globalData.storeId,
				desk_id: app.globalData.deskId,
				showMask: false,
				url: app.globalData.baseImgUrl,
				confirmOrderData: [],
				cartList: [],
				total_price: '0.00',
				payment_method: 'wx_pay', //wx_pay：微信支付；balance：余额支付，
				deskInfo: [],
				chooseRedPacketInfo: {},
				chooseCouponInfo: {},
				memberStoreInfo: {},
				balance_pay_state:false,
			}
		},
		onLoad() {
			var that = this;
			that.getConfirmOrderData();
			that.getCartList();
			that.getDeskInfo();
			that.getMemberStoreInfo();




		},
		onUnload() {
			delete app.globalData.redPacketList;
			delete app.globalData.chooseRedPacketInfo;
			delete app.globalData.couponList;
			delete app.globalData.chooseCouponInfo;
			console.log('app.globalData', app.globalData);
		},
		onShow() {
			var that = this;
			console.log(that.cartList.length);
			if (that.cartList.length == 0) return;
			that.chooseRedPacketInfo = app.globalData.chooseRedPacketInfo;
			that.chooseCouponInfo = app.globalData.chooseCouponInfo;
			var decrement = 0;
			if (that.chooseRedPacketInfo) {
				decrement += Number(that.chooseRedPacketInfo.money);
			}
			if (that.chooseCouponInfo) {
				decrement += Number(that.chooseCouponInfo.money);
			}
			console.log(decrement);
			that.total_price = that.cartList.cart_total.amount - decrement > 0 ? (that.cartList.cart_total.amount - decrement).toFixed(
					2) :
				'0.00';
			console.log(that.total_price, "onshow");
			if(parseFloat(that.memberStoreInfo.usableBalance) - parseFloat(that.total_price) >= 0){
				console.log('大大大');
				that.balance_pay_state = true;
			}else{
				console.log('小小小');
				that.balance_pay_state = false;
			}
		},
		methods: {
			//店铺会员信息
			getMemberStoreInfo() {
				var that = this;
				http.post('/api/v1/store/get_member_store_info', {
					store_id: that.store_id
				}, res => {
					that.memberStoreInfo = res.datas;

					that.memberStoreInfo.usableBalance = parseFloat(that.memberStoreInfo.available_predeposit * that.memberStoreInfo.predeposit_use_proportion /
						100).toFixed(2);
						
					console.log(that.memberStoreInfo, "xxxx")
					console.log('that.memberStoreInfo.usableBalance>>>'+that.memberStoreInfo.usableBalance);
					console.log('that.total_price>>>'+that.total_price);
					if(parseFloat(that.memberStoreInfo.usableBalance) - parseFloat(that.total_price) >= 0){
						console.log('大大大2');
						that.balance_pay_state = true;
					}else{
						console.log('小小小2');
						that.balance_pay_state = false;
					}


				});
			},
			//预览订单商品数据
			getConfirmOrderData() {
				var that = this;
				http.post('/api/v1/order/buy_step1', {
					store_id: that.store_id
				}, res => {
					that.confirmOrderData = res.datas;
				});
			},
			//购物车列表
			getCartList() {
				var that = this;
				http.post('/api/v1/cart/cart_list', {
					store_id: that.store_id
				}, res => {
					that.cartList = res.datas;
					that.total_price = parseFloat(res.datas.cart_total.amount).toFixed(2);
					
					console.log('that.memberStoreInfo.usableBalance>>>'+that.memberStoreInfo.usableBalance);
					console.log('that.total_price>>>'+that.total_price);
					if(parseFloat(that.memberStoreInfo.usableBalance) - parseFloat(that.total_price) >= 0){
						console.log('大大大3');
						that.balance_pay_state = true;
					}else{
						console.log('小小小3');
						that.balance_pay_state = false;
					}
				});
			},
			//获取桌号信息
			getDeskInfo() {
				var that = this;
				http.post('/api/v1/store/store_desk_info', {
					desk_id: that.desk_id,
					store_id: that.store_id
				}, res => {
					that.deskInfo = res.datas;
				});
			},
			//立即支付
			buy() {
				var that = this;
				if (!that.showMask) {
					that.changeMask();
				} else {
					uni.showLoading();
					console.log(that.chooseCouponInfo)
					http.post('/api/v1/order/buy_step2', {
						store_id: that.store_id,
						coupon_id: that.chooseCouponInfo ? that.chooseCouponInfo.mc_id : 0,
						store_red_id: that.chooseRedPacketInfo ? that.chooseRedPacketInfo.id : 0,
						payment_code: that.payment_method,
						desk_id: that.desk_id
					}, res => {
						if (res.state == 1) {
							uni.hideLoading()
							if (res.datas.paySign) {
								uni.getProvider({
									service: 'oauth',
									success: function(providerRes) {
										if (~providerRes.provider.indexOf("weixin")) {
											uni.requestPayment({
												provider: "weixin",
												timeStamp: res.datas.timeStamp,
												nonceStr: res.datas.nonceStr,
												package: res.datas.package,
												signType: res.datas.signType,
												paySign: res.datas.paySign,
												success: function() {
													uni.reLaunch({
														url: '/pages/store/order/result/result?order_id=' + res.datas.order_id
													});
												}
											});
										}
									}
								});
							} else {
								uni.navigateTo({
									url: '/pages/store/order/result/result?order_id=' + res.datas.order_id
								});
							}
						} else if (res.state == 10001) {
							uni.hideLoading()
							uni.navigateTo({
								url: '/pages/store/order/result/result?order_id=' + res.datas.order_id
							});
						} else {
							uni.hideLoading()
							uni.showToast({
								title: res.datas,
								icon: 'none'
							});
						}
					});
				}
			},
			//更改支付类型
			changePaymentMethod(e) {
				var that = this;
				console.log(e.currentTarget)
				if (e.currentTarget.dataset.enable == false) return;
				that.payment_method = e.currentTarget.dataset.type;
			},
			//选择优惠券
			chooseCoupon() {
				var that = this;
				if (!that.confirmOrderData.coupon_list.length > 0) return;
				app.globalData.couponList = that.confirmOrderData.coupon_list;
				uni.navigateTo({
					url: '/pages/store/couponList/couponList'
				});
			},
			//选择红包
			chooseRedPacket() {
				var that = this;
				if (!that.confirmOrderData.store_red_list.length > 0) return;
				app.globalData.redPacketList = that.confirmOrderData.store_red_list;
				uni.navigateTo({
					url: '/pages/store/redPacketList/redPacketList'
				});
			},
			//遮罩状态切换
			changeMask() {
				this.showMask = !this.showMask;
			},
			//阻止遮罩滑动
			catchtouchmove() {
				return false;
			},
		}
	}
</script>
